<template>
  <PanelComp title="告警趋势">
    <template #content>
      <div id="historyChart"></div>
    </template>
  </PanelComp>
</template>

<script setup>
import { historyWarning } from "@/cesiumTools/echartsOpts";
import * as echarts from "echarts";
import { onMounted } from "vue";
import { historyWarningData } from "@/store/staticData";
import PanelComp from "./PanelComp.vue";

onMounted(() => {
  initChart();
});

const initChart = () => {
  const myChart = echarts.init(document.getElementById("historyChart"));
  const options = historyWarning(historyWarningData);
  myChart.setOption(options);
};
</script>
<style scoped lang="scss">
#historyChart {
  width: 500px;
  height: 230px;
  margin: 0 auto;
}
</style>
